import React, { Component } from 'react';
import { View, ActivityIndicator } from 'react-native';
import { Container, Content, Form, Item, Input, Label, Button, Text, Spinner } from 'native-base';
export default class Login extends Component {
  constructor(props) {
    super(props);
    this.state = {
      isLogin : false
    };
    this.btn = false;
  }

  _login = () => {
    //阻止多次 点击
    if (this.btn) return;
    this.btn = true;
    const { navigation } = this.props;
    this.setState({
      isLogin : true
    });
    setTimeout(() => {
      navigation.navigate('BottomTab');
    }, 2000);
  };

  render() {
    const { isLogin } = this.state;
    return (
      <Container>
        <View style={{ height: 50, justifyContent: 'center', alignItems: 'center', marginTop: 50 }}>
          <Text style={{ fontSize: 30 }}>登录</Text>
        </View>
        <Content>
          <Form>
            <Item floatingLabel>
              <Label>Username</Label>
              <Input />
            </Item>
            <Item floatingLabel last>
              <Label>Password</Label>
              <Input />
            </Item>
          </Form>
          <Button iconRight block onPress={this._login} style={{ marginTop: 40, marginHorizontal: 20 }}>
            <Text>登录</Text>
            {isLogin ? <Spinner color='#fff' /> : null}
          </Button>
        </Content>
      </Container>
    );
  }
}
